<template>
    <div class="emoji-box">
        <div class="emoji-txt-input"  @click="chooseEmoji('😃')">😃</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😍')">😍</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😒')">😒</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😳')">😳</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😁')">😁</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😘')">😘</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😉')">😉</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😠')">😠</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😞')">😞</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😥')">😥</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😭')">😭</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😝')">😝</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😡')">😡</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😣')">😣</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😔')">😔</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😄')">😄</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😷')">😷</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😚')">😚</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😓')">😓</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😂')">😂</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😊')">😊</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😢')">😢</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😜')">😜</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😨')">😨</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😰')">😰</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😲')">😲</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😏')">😏</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😱')">😱</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😪')">😪</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😖')">😖</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('😌')">😌</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👿')">👿</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👻')">👻</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🎅')">🎅</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👧')">👧</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👦')">👦</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👩')">👩</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👨')">👨</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🐶')">🐶</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🐱')">🐱</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👍')">👍</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👎')">👎</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👊')">👊</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('✊')">✊</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('✌')">✌</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('💪')">💪</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👏')">👏</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👈')">👈</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👆')">👆</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👇')">👇</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👌')">👌</div>
        <!--<div class="emoji-txt-input"  @click="chooseEmoji('❤')">❤</div>-->
        <img class="emoji emoji2764" src="../../assets/spacer.gif" @click="chooseEmoji('❤')" />

        <div class="emoji-txt-input"  @click="chooseEmoji('💔')">💔</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🙏')">🙏</div>
        <!--<div class="emoji-txt-input"  @click="chooseEmoji('☀')">☀</div>-->
        <img class="emoji emoji2600" src="../../assets/spacer.gif" @click="chooseEmoji('☀')" />

        <div class="emoji-txt-input"  @click="chooseEmoji('🌙')">🌙</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🌟')">🌟</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('⚡')">⚡</div>
        <!--<div class="emoji-txt-input"  @click="chooseEmoji('☁')">☁</div>-->
        <img class="emoji emoji2601" src="../../assets/spacer.gif" @click="chooseEmoji('☁')" />

        <div class="emoji-txt-input"  @click="chooseEmoji('☔')">☔</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🍁')">🍁</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🌻')">🌻</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🍃')">🍃</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👗')">👗</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🎀')">🎀</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('👄')">👄</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🌹')">🌹</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('☕')">☕</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🎂')">🎂</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🕙')">🕙</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🍺')">🍺</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🔍')">🔍</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('📱')">📱</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🏠')">🏠</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🚗')">🚗</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('🎁')">🎁</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('⚽')">⚽</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('💣')">💣</div>
        <div class="emoji-txt-input"  @click="chooseEmoji('💎')">💎</div>
        <!--<img class="emoji emoji1f48e" src="../../assets/spacer.gif" @click="chooseEmoji('💎')" />-->
    </div>
</template>
<script>
    export default {
        methods: {
            chooseEmoji(emoji) {
                this.$emit('choose', emoji)
            }
        }
    }
</script>

<style lang="less">
    .emoji-box {
        width: 480px;
    .emoji {
        margin: 5px;
    }
    }
</style>
